<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title>{$postdata.title}</title>
    <link rel="icon" href="favicon.ico" type="image/ico">
    <link href="/static/query/bootstrap.min.css" rel="stylesheet">
    <link href="/static/query/materialdesignicons.min.css" rel="stylesheet">
    <link href="/static/query/style.min.css" rel="stylesheet">
    <style>
        .card {
            border-radius: 15px;
        }

        .media-list-message {
            padding-top: 2rem;
            border-top: 1px solid rgba(77, 82, 89, 0.05);
        }

        .media-list-message .media {
            display: -ms-flexbox;
            display: flex;
            -ms-flex-align: start;
            align-items: flex-start;
        }

        .media-list-message ul {
            padding: 0px;
            margin: 0px;
        }

        .media-list-message>li {
            border-bottom: 1px solid rgba(77, 82, 89, 0.05);
            margin-bottom: 10px;
        }

        .media-list-message .media>a {
            position: relative;
            display: inline-block;
            background-color: #f5f6f7;
            -webkit-border-radius: 50%;
            border-radius: 50%;
            margin-right: 10px;
        }

        .media-list-message .media .media {
            padding-top: 10px;
            padding-bottom: 10px;
        }

        .media-list-message li:last-child .media {
            padding-bottom: 0px;
        }

        .media-list-message .media-body {
            -ms-flex: 1;
            flex: 1;
        }

        .message-form {
            position: relative;
            display: -webkit-box;
            display: flex;
            -webkit-box-align: center;
            align-items: center;
            padding-top: 10px;
        }

        .media-list-message .message-form {
            padding-bottom: 10px;
        }

        .img-avatar-30 {
            width: 30px;
            height: 30px;
        }

        .message-form .form-control {
            border: none;
            margin: 0px 5px;
        }

        .message-form .form-control:focus {
            box-shadow: none;
        }

        .message-form .mdi {
            font-size: 20px;
            color: #4d5259;
        }

        .message-btn-close {
            display: none;
        }

        .nav-tabs>li>a {
            margin-right: 0px;
            border: none;
            border-bottom: 1px solid transparent;
            border-radius: 0;
            color: black;
        }

        .nav-tabs>li.active>a,
        .nav-tabs.nav>li>a:hover,
        .nav-tabs.nav>li>a:focus {
            text-decoration: none;
            background-color: transparent;
            border-bottom-color: white;
        }

        p {
            font-size: 16px;
        }
    </style>
</head>

<body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <header class="card-header">
                        <div class="card-title" style="font-size: 26px;font-weight:bolder">
                            {$postdata.title}
                        </div>
                    </header>
                    <div class="card-body">
                        <ul class="nav nav-tabs" style="padding-bottom: 15px;">
                            <li class="nav-item">
                                <a class="nav-left" data-toggle="tab" aria-selected="true">
                                    <img style="width: 80px; height: 80px; border-radius: 50px;"
                                        src="{$postdata.usertx}" alt="">
                                </a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" aria-selected="false"
                                    style="font-size: 20px;">作者：{$postdata.nickname}
                                    {if $postdata.usertitle == ""}
                                    {else /}
                                    <span class="btn btn-xs btn-primary" style="margin: 0 10px;padding: 0px 3px;">
                                        {$postdata.usertitle}
                                    </span>
                                    {/if}
                                </a>
                                <a class="nav-link" style="font-size: 20px;">发布时间：{$postdata.createtime}</a>
                            </li>
                        </ul>
                        <div class="tab-content">
                            <div class="tab-pane show active" id="jinyong">
                                <p style="font-size: 23px;">{$postdata.content|raw}</p>
                                <div class="text-center">
                                    {if $postdata.is_type == 0}
                                    <ul class="thumbnails nav nav-tabs" id="gallery">
                                        {foreach $file as $k=>$vo }
                                        <li class="span3">
                                            <a href="{$vo}" target="_blank">
                                                <img style="width: 200px;" src="{$vo}">
                                            </a>
                                        </li>
                                        {/foreach}
                                    </ul>
                                    {else /}
                                    <video width="100%" controls>
                                        <source src="{$postdata.video_url}" type="video/mp4">
                                    </video>
                                    {/if}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <h4>帖子评论</h4>
                    </div>
                    <div class="card-body">
                        <ul class="media-list media-list-message">
                            {foreach $comment as $key=>$value}
                            <li>
                                <div class="media">
                                    <a href="javascript:void(0)">
                                        <img src="{$value.usertx}" class="img-avatar img-avatar-30"
                                            alt="{$value.nickname}"></a>
                                    <div class="media-body">
                                        <p>
                                            <a href="javascript:void(0)"><strong>{$value.nickname}</strong></a>
                                            <a href="javascript:void(0)" class="pull-right text-fade m-l-5 reply-btn"
                                                data-id='5'></a>
                                            <time class="pull-right text-fade">{$value.time}</time>
                                        </p>
                                        {if $value.parentid != 0}
                                        <div style="background: #c1c1c1;border-radius: 10px;">
                                            <p style="padding: 5px 10px 0 10px;">回复 {$value.parentnickname}</p>
                                            <p style="padding: 0 10px 5px 10px;">{$value.parentcontent}</p>
                                        </div>
                                        {/if}
                                        <p>{$value.content|raw}</p>
                                    </div>
                                </div>
                            </li>
                            {/foreach}
                        </ul>
                    </div>
                    <hr>
                    <div class="text-center" style="padding: 10px;">
                        <a href="{$app.download}">
                            <h2>更多评论内容请下载App查看</h2>
                        </a>
                    </div>
                </div>
            </div>

        </div>
    </div>
</body>

</html>